<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>动态添加删除行</title>

    <script src="__JS__/jquery.min.js"></script>
    <link href="__CSS__/query_style.css" rel="stylesheet" type="text/css">

    <style type="text/css">
        .yellow3-int{ background: #2a57a6; color: #fff; padding: 6px 20px; border: none; border-radius: 8px; font-size: 10px;}
        .yellow4-int{ background: #2a57a6; color: #fff; padding: 6px 20px; border: none; border-radius: 8px; font-size: 10px;}

    </style>
    <script type="text/javascript">
        $(function () {
            var show_count = 20;   //要显示的条数
            var count = 1;    //递增的开始值，这里是你的ID
            $("#btn_addtr").click(function () {

                var length = $("#dynamicTable tbody tr").length;
                //alert(length);
                if (length < show_count)    //点击时候，如果当前的数字小于递增结束的条件
                {
                    $("#tab11 tbody tr").clone().appendTo("#dynamicTable tbody");   //在表格后面添加一行
                    changeIndex();//更新行号
                }
            });


        });
        function changeIndex() {
            var i = 1;
            $("#dynamicTable tbody tr").each(function () { //循环tab tbody下的tr
                $(this).find("input[name='NO']").val(i++);//更新行号
            });
        }

        function deltr(opp) {
            var length = $("#dynamicTable tbody tr").length;
            //alert(length);
            if (length <= 1) {
                alert("至少保留一行");
            } else {
                $(opp).parent().parent().remove();//移除当前行
                changeIndex();
            }
        }



        function getArray(name,erroDesc){
            var arrays=$("input[name='"+name+"']");
            var newArrays=new Array();
            for(var i=1;i<arrays.length;i++) {
                var name= $(arrays[i]).val();
                if(!name){
                    alert(erroDesc);
                    return "false";
                }else{
                    newArrays[i-1]=name;
                }
            }
            return newArrays;
        }
        function save() {


            var loginNameArray=getArray("loginName","登录名不能为空！");
            if(loginNameArray=="false"){
                return false;
            }

            var mailArray=getArray("mail","邮箱不能为空！");
            if(mailArray=="false"){
                return false;
            }

            var deployNameArray=getArray("deployName","展示名不能为空！");
            if(deployNameArray=="false"){
                return false;
            }

            var sexArray=getArray("sex","性别不能为空！");
            if(sexArray=="false"){
                return false;
            }
            var passwordArray=getArray("password","密码不能为空！");
            if(passwordArray=="false"){
                return false;
            }


            $.ajax({
                type: "POST",
                url: "/User/Admin/doAddUser",
                data: {"loginNameArray":loginNameArray,"mailArray":mailArray,
                        "deployNameArray":deployNameArray,sexArray:sexArray,
                        "passwordArray":passwordArray},
                success: function(result){
                    alert(result.message);
                    if(result.code==1){
                        window.location.href="/User/Admin/query";
                    }
                },

                error(e){
                    console.log(e);
                   alert("系统异常!");
                },


            });
        }
    </script>

</head>
<body>
<!-- top -->
<div id="xt-top">
    <div class="xt-logo"><img src="_IMAGE/logo.png"/></div>
    <div class="xt-geren">
        <div class="xt-exit"><span class="xt-span">您好!
            <?php echo $loginVo->getDeployName();?>  ，欢迎您登录管理中心</span><a href="#" class="help">帮助</a>
            <a href="#" class="exit">退出</a></div>
    </div>
</div>

<div style="width:720px;margin:20px auto;">

    <table id="tab11" style="display: none">
        <tbody>
        <tr>
            <td align="center">
                <input type="text" name="loginName" /></td>
            <td align="center">
                <input type="text" name="mail" /></td>
            <td align="center">
                <input type="text" name="deployName" /></td>
            <td align="center">
                <input type="text" name="sex" /></td>
            <td align="center">
                <input type="text" name="password" /></td>
            <td>
                <input type="button" id="Button1" onClick="deltr(this)"  class="yellow4-int" value="删行">
            </td>
        </tr>
        </tbody>
    </table>

    <input type="button" id="btn_addtr"  value="新增用户"  class="yellow3-int" />
    <br/>
    <br/>
    <br/>

    <table id="dynamicTable" width="700" border="0" cellspacing="0" cellpadding="0">
        <thead>
        <tr>
            <td align="center" bgcolor="#CCCCCC">登录名</td>
            <td align="center" bgcolor="#CCCCCC">邮箱</td>
            <td align="center" bgcolor="#CCCCCC">展示名</td>
            <td align="center" bgcolor="#CCCCCC">性别</td>
            <td align="center" bgcolor="#CCCCCC">登录密码</td>

        </tr>
        </thead>
        <tbody>
        <tr>
            <td align="center">
                <input type="text" name="loginName" /></td>
            <td align="center">
                <input type="text" name="mail" /></td>
            <td align="center">
                <input type="text" name="deployName" /></td>
            <td align="center">
                <input type="text" name="sex" /></td>
            <td align="center">
                <input type="text" name="password" /></td>
            <td >
                <input type="button" id="Button2" onClick="deltr(this)"  class="yellow4-int" value="删行">
            </td>
        </tr>
        </tbody>
    </table>
    <br/>
    <br/>

    <input type="button" id="Button3" onClick="save()"  class="yellow3-int" value="保存">


</div>

</body>
</html>
